<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <title>确认订单</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link href="/public/static/homes/css/iconfont/iconfont.css" rel="stylesheet"/>
    <link href="/public/static/homes/css/common.css" rel="stylesheet"/>
    <link href="/public/static/homes/css/cart.css" rel="stylesheet"/>
</head>
<body class="graybg-theme">
    <!--头部-->
{:widget("Cate/header")}
        <div class="cart-header wrapper">
            <div class="logo">
                <a href="index.html"><img src="/public/static/homes/img/logo.png" alt="logo" /></a>
            </div>
            <div class="step-box">
                <div class="row">
                    <div class="step first active col-3">
                        <span class="num">1</span><span class="line"></span><span class="label">我的购物车</span>
                    </div>
                    <div class="step active col-3">
                        <span class="num">2</span><span class="line"></span><span class="label">确认订单信息</span>
                    </div>
                    <div class="step col-3">
                        <span class="num">3</span><span class="line"></span><span class="label">选择支付方式</span>
                    </div>
                    <div class="step last col-3">
                        <span class="num">4</span><span class="line"></span><span class="label">完成付款</span>
                    </div>
                </div>
            </div>
        </div>
    <!--头部-->

    <div class="wrapper confirm-wrap">
        <div class="confirm-tit">
            <span class="tit">选择收货地址 :</span>
        </div>
        <div class="confirm-address clearfix">
            {foreach name="address" item="row"}
            {if condition="$row['status'] == 1"}
            <div class="col col-4">
                <div class="item active sitesl" name="{$row['id']}">
                    <div class="action">
                        <a class="edit" href="javascript:;">修改</a>
                    </div>
                    <div class="info">
                        <div class="ellipsis"><img src="/public/static/homes/img/ico/user.jpg" alt="" />{$row['adds']}（{$row['uname']} 收）</div>
                        <div class="ellipsis"><img src="/public/static/homes/img/ico/dizhi.jpg" alt="" />{$row['site']}</div>
                        <div class="ellipsis"><img src="/public/static/homes/img/ico/tel.jpg" alt="" />{$row['phone']}</div>
                    </div>
                </div>
            </div>
            {else/}
            <div class="col col-4">
                <div class="item sitesl" name="{$row['id']}">
                    <div class="action">
                        <a class="edit" href="">修改</a>
                    </div>
                    <div class="info">
                        <div class="ellipsis"><img src="/public/static/homes/img/ico/user.jpg" alt="" />{$row['adds']}（{$row['uname']} 收）</div>
                        <div class="ellipsis"><img src="/public/static/homes/img/ico/dizhi.jpg" alt="" />{$row['site']}</div>
                        <div class="ellipsis"><img src="/public/static/homes/img/ico/tel.jpg" alt="" />{$row['phone']}</div>
                    </div>
                </div>
            </div>
            {/if}
            {/foreach}
            <div class="col col-4">
                <a class="item va-m-box ta-c add" id="item">
                    <div class="add-new">
                        <span class="ico"><i class="iconfont icon-tianjia"></i></span>
                        <div class="label">添加收货地址</div>
                    </div>
                </a>
            </div>
        </div>
        <div class="confirm-address-bar"  style="display: none;">
            <a href="javascript:;" class="drop" data-action="drop">显示全部地址</a>
        </div>
        <div class="confirm-tit">
           <span class="tit">确认商品信息:</span><div class="right"><a class="back" href="/cart/add">返回购物车></a></div>
        </div>
        <div class="confirm-goods">
            <div class="confirm-goods-hd clearfix">
                <div class="col col1">商品名称</div>
                <div class="col col2">单价（元）</div>
                <div class="col col3">数量</div>
                <div class="col col4">小计（元）</div>
            </div>
            {foreach name="data" item="value"}
            <div class="confirm-goods-bd">
                <div class="goods clearfix">
                    <div class="col col1">
                        <img src="{$value['pic']}" alt="">
                        <div class="info">
                            <div class="name">{$value['name']}</div>
                        </div>
                    </div>
                    <div class="col col2">{$value['price']}</div>
                    <div class="col col3">{$value['num']}</div>
                    <div class="col col4 sss">{$value['price']*$value['num']}</div>
                </div>
            </div>
            {/foreach}
            <p></p>
            <div class="confirm-goods-ft clearfix">
                <div class="fl"><span class="vm-ib">买家留言： </span><textarea class="ui-txtin" style="width: 410px;" name="" placeholder="在此输入给商家的留言"></textarea></div>
                <div class="fr" id="sso">店铺合计(含运费): ¥{$total}</div>
            </div>
            <div class="control-group">
                <div class="hd">
                    优惠劵：
                </div>
                <div class="bd">
                   <input type="radio" name="quan" value="50">50元购物抵扣券
                   <input type="radio" name="quan" value="100">100元购物抵扣券
                </div>
            </div>
        
         <div class="confirm-total">
            <div class="box">
                <div class="item">应付总额：<strong> ¥ {$total}</strong></div>
                <form action="/pay/pay" method="post">
                    <input type="hidden" name="sid" value="" id="ssid">
                    <button class="ui-btn-theme go-charge">去结算</button>
                </form>
            </div>
        </div>
    </div>

    <!--脚部-->
    <div class="fatfooter">

    </div>
    <!--脚部-->
    <div id="addressform" style="display:none" class="layer-address">
        <form action="/account/insertaddress" method="post">
            <div class="control-group">
                <div class="hd">
                    收货人姓名：
                </div>
                <div class="bd">
                    <input class="ui-txtin ui-txtin-thin" style="width: 200px;" type="text" name="uname" id="">
                </div>
            </div>
            <div class="control-group">
                <div class="hd">
                    联系电话：
                </div>
                <div class="bd">
                    <input class="ui-txtin ui-txtin-thin" style="width: 200px;" type="text" name="phone" id="">
                </div>
                
            </div>
            <div class="control-group">
                <div class="hd vat">
                    所在地区：
                </div>
                <div class="bd">
                    <select id="sid" class="ui-txtin ui-txtin-thin" style="width: 180px;" name="">
                        <option value="" class="ss">--请选择--</option>
                    </select>
                    <input type="hidden" name="adds" value="">
                    <div class="mt10">
                        <input class="ui-txtin ui-txtin-thin" style="width: 560px;" type="text" name="site" id="" placeholder="请填写具体地址，不需要重复填写省/市/区">
                    </div>
                </div>
            </div>
            <!-- <div class="control-group">
                <div class="hd vat">
                    邮政编码：
                </div>
                <div class="bd">
                    <input class="ui-txtin ui-txtin-thin" style="width: 200px;" type="text" name="" id="">
                </div>
            </div> -->
            <div class="control-bottom clearfix">
                <button class="fl btn ui-btn-theme" id="ress">保存</button><a href="" class="fr btn ui-btn cancle">取消</a>
            </div>
        </form>
    </div>
</body>
<script src="/public/static/homes/js/jquery.js"></script>
<script type="text/javascript" src="/public/static/bs/js/jquery-1.8.3.min.js"></script>
<link rel="stylesheet" href="/public/static/homes/js/icheck/style.css"/>
<script src="/public/static/homes/js/icheck/icheck.min.js"></script>
<script src="/public/static/homes/js/layer/layer.js"></script>
<script src="/public/static/homes/js/global.js"></script>

<script>
    //第一级数据
    $.ajax({
        'url':'/account/address',//请求地址
        'type':'get',//类型
        'aysnc':true,
        'data':{upid:0},//附加参数
        'dataType':'json',//响应数据类型
        success:
        function(data){
            //遍历
            for(var i=0;i<data.length;i++){
                $(".ss").attr("disabled",true);
                //1.把遍历出来的数据添加到option标签里
                o='<option value="'+data[i].id+'">'+data[i].name+'</option>';
                //2.把带有数据的option选项内部插入到 id值是sid的select里
                $("#sid").append(o);
            }
        },
        error:
        function(){
            alert('Ajax响应失败');
        }
    });

    //Ajax 其他级别
    //live 绑定事件和事件处理函数
    $("select").live('change',function(){
        ob=$(this);
        //清除其他累积数据
        ob.nextAll("select").remove();
        //获取上一级别id(当做其他级别upid)
        upid=ob.val();
        $.ajax({
        'url':'/account/address',//请求地址
        'type':'get',//类型
        'aysnc':true,
        'data':{upid:upid},//附加参数
        'dataType':'json',//响应数据类型
        success:
        function(data){
            //创建select
            select=$("<select></select>");
            //内部追加
            select.append("<option value='' class='mm'>--请选择--</option>");
            // alert(data);
            if(data.length>0){
            //遍历
            for(var i=0;i<data.length;i++){
                //1.把遍历出来的数据添加到option标签里
                o='<option value="'+data[i].id+'">'+data[i].name+'</option>';
                //2.把带有数据的option选项内部插入到 创建好的select里
                select.append(o);
            }
            //追加select
            ob.after(select);
            $(".mm").attr("disabled",true);
            }
        },
        error:
            function(){
                alert('Ajax响应失败');
            }
        });
    });

    //提交获取选中数据
    $("#ress").click(function(){
        arr=[];
        //遍历select
        $("select").each(function(){
            //获取选中数据
            adds=$(this).find("option:selected").html();
            arr.push(adds);
        });
        //赋值给隐藏域
        $("input[name='adds']").val(arr);
    })
</script>
<script>
//这里不使用自带按钮，因为设计按钮较特殊，不准备作为通用样式
$('.confirm-address .edit,.confirm-address .add').on('click',function () {
    layer.open({
        type: 1,
        skin: 'layui-layer-seaing',
        title: '标题',
        area: ['720px', 'auto'],
        content: $('#addressform')
        //btn: ['按钮一', '按钮二']
    });
});
$(document.body).on('click','.layer-address .cancle',function () {
    layer.closeAll();
    return false;
})

//
function juggeAddressNum () {
    var col=$('.confirm-address .col'),
    cH=col.height();
    $('.confirm-address').height(cH)
    if (col.length>3) {
        $('.confirm-address-bar').show();
    }
    else {
        $('.confirm-address-bar').hide();
    }
}
juggeAddressNum();
zAction.add({
    'drop':function () {
        $('.confirm-address').height('auto')
        var h=$('.confirm-address').height()
        juggeAddressNum();
        $('.confirm-address').animate({height: h}, 300);
        $(this).parent().remove();
    }
});


//选中地址
    $('.sitesl').click(function(){
        $(this).each(function(){           
            id = $(this).attr('name');
            $.get('/account/selected',{id:id},function(data){
                $('#ssid').val(data);
            });
            $('.sitesl').attr('class','item sitesl');
            $(this).attr('class','item active sitesl');
        });
        $('.sitesl').each(function(){
            $('#item').last().attr('class','item va-m-box ta-c add');
        });
    });

//获取默认地址id
$('.sitesl').each(function(){
    cla = $(this).attr('class')
    if(cla == 'item active sitesl'){
        id = $(this).attr('name');
        $('#ssid').val(id);
    }  
});  

</script>

</html>